<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width, initial-scale=1" name="viewport">
    <title>玉灵 QQ:7031633 Email:webrx@126.com</title>
    <meta content="关键字" name="keywords">
    <meta content="简介" name="description">
    <style>
        @keyframes mm {
            from {
                color: red;
            }
            to {
                color: green;
            }
        }

        @keyframes cc {
            0% {
                color: red;
            }
            10% {
                color: #0059ff;
            }
            30% {
                color: #00ff22;
            }

            90% {
                color: #00ff22;
            }
            90% {
                color: #b700ff;
            }
            100% {
                color: #ff8800;
            }
        }
        
        h1 {
            text-align: center;
            font: bold normal 55px/65px "";
            color: red;
            animation: cc 5s linear 0s alternate infinite;
        }
    </style>
</head>

<body>
<h1>annimation 变色文字效果</h1>
</body>
</html>
